<template>
  <p-table
    class="table-list-container"
    row-key="id"
    :columns="columns"
    :scroll="{ x: '100%', y: 'calc(100vh - 380px)' }"
    bordered
    v-bind="$attrs"
    v-on="$listeners"
  >
    <a
      slot="serialNumber"
      slot-scope="text, record"
      @click="$emit('number-click', record)"
    >
      {{ text }}
    </a>
  </p-table>
</template>

<script>
import { getDicList, postOrganizationInfo } from '@/api/public.js';
const defaultForm = {
  asc: true,
  currStatus: '',
  current: 1,
  endTime: '',
  keyword: '',
  nodeCode: '',
  pageSize: 10,
  priceChangeDescribe: '',
  salesGroup: '',
  salesOrganization: '',
  startTime: '',
};
export default {
  props: {
    // forms: {
    //   type: Object,
    //   default: () => ({}),
    // },
  },
  data() {
    return {
      selectedRowKeys: [],
      nodeOptions: [],
      stateOptions: [],
      orgOptions: [],
      // pagination: {
      //   pageSize: 10,
      //   current: 1,
      //   defaultPageSize: 10,
      //   pageSizeOptions: ['10', '20', '50', '100'],
      //   showLessItems: true,
      //   total: 0,
      //   showSizeChanger: true,
      //   showTotal: (total) => {
      //     return `总计${total}条`;
      //   },
      // },
      form: {
        ...defaultForm,
      },
    };
  },
  computed: {
    columns() {
      const columns = [
        {
          align: 'center',
          title: '序号',
          width: 50,
          customRender(t, r, index) {
            return parseInt(index) + 1;
          },
        },
        {
          align: 'center',
          title: '价格变更编号',
          dataIndex: 'serialNumber',
          width: 150,
          sorter: true,
          ellipsis: true,
          scopedSlots: { customRender: 'serialNumber' },
        },
        {
          align: 'center',
          title: '销售组织',
          dataIndex: 'salesOrganization',
          customRender: (text) => this.orgOptions[text],
          ellipsis: true,
          width: 80,
          sorter: true,
        },
        {
          align: 'center',
          title: '销售组',
          dataIndex: 'salesGroupName',

          sorter: true,
          ellipsis: true,
          width: 80,
        },
        {
          align: 'center',
          title: '变更年月',
          dataIndex: 'timeChange',
          sorter: true,
          ellipsis: true,
          width: 120,
        },
        {
          align: 'center',
          title: '价格变更简述',
          dataIndex: 'priceChangeDescribe',
          sorter: true,
          width: 110,
          ellipsis: true,
        },
        {
          align: 'center',
          title: '当前状态',
          dataIndex: 'currStatus',
          customRender: (text) => this.stateOptions[text],
          sorter: true,
          ellipsis: true,
          width: 100,
        },
        {
          align: 'center',
          title: '当前节点',
          dataIndex: 'nodeCode',
          customRender: (text) => this.nodeOptions[text],
          width: 100,
          sorter: true,
          ellipsis: true,
        },
        {
          align: 'center',
          title: '当前处理人',
          dataIndex: 'handleUserName',
          sorter: true,
          width: 100,
          ellipsis: true,
        },
        {
          align: 'center',
          title: '发起人',
          dataIndex: 'createUserName',
          width: 90,
          sorter: true,
          ellipsis: true,
        },
        {
          align: 'center',
          title: '发起时间',
          dataIndex: 'createTime',
          width: 160,
          sorter: true,
          ellipsis: true,
        },
      ];
      return columns;
    },
  },
  watch: {
    // forms: {
    //   handler(val) {
    //     this.form = val;
    //     this.loadTableList(this.form);
    //   },
    //   deep: true,
    // },
  },
  async created() {
    this.nodeOptions = await this.getDicList('price_node');
    this.stateOptions = await this.getDicList('state');
    this.orgOptions = await this.postOrganizationInfo();
  },
  methods: {
    async postOrganizationInfo() {
      const result = await postOrganizationInfo({
        code: 'ltcsmsizebu',
      });
      const data = result?.data?.data || [];
      return data.reduce((pre, cur) => {
        pre[cur.code] = cur.name;
        return pre;
      }, {});
    },
    async getDicList(code) {
      if (!code) return [];
      const result = await getDicList(code);
      const data = result?.data?.data || [];
      return data.reduce((pre, cur) => {
        pre[cur.value] = cur.label;
        return pre;
      }, {});
    },
  },
};
</script>

<style lang="less" scoped>
.table-list-container {
  margin-top: 10px;
}
</style>